<!--
*** Created by zhumin on 2023/03/24.***
*** Description: "大屏界面"
-->
<template>
  <div class="home-content">
    <div class="home-top">
      <div class="left">{{ athleteInfo.name1 }}</div>
      <div class="right">{{ athleteInfo.name2 }}</div>
    </div>
    <div class="home-bottom">
      <div class="bottom-left">
        <div class="card">
          <div v-if="true">
            <div class="line1">
              <div class="pink">P</div>
            </div>
            <div class="line2">
              <div class="red"></div>
              <div class="yellow"></div>
            </div>
            <div class="line3">
              <div class="red">P</div>
              <div class="yellow">P</div>
            </div>
          </div>
          <div v-else>
            <div class="line4">
              <div class="default1"></div>
              <div class="default2"></div>
            </div>
          </div>
        </div>
        <div class="game-info">
          <div class="area-name">{{ areaInfo.name1 }}</div>
          <div class="left-score">
            1
          </div>
        </div>
      </div>
      <div class="bottom-center">
        <div>R2</div>
        <div>3:00</div>
      </div>
      <div class="bottom-right">
        <div class="card">
          <div v-if="true">
            <div class="line1">
              <div class="pink">P</div>
            </div>
            <div class="line2">
              <div class="yellow"></div>
              <div class="red"></div>
            </div>
            <div class="line3">
              <div class="yellow">P</div>
              <div class="red">P</div>
            </div>
          </div>
          <div v-else>
            <div class="line4">
              <div class="default1"></div>
              <div class="default2"></div>
            </div>
          </div>
        </div>
        <div class="game-info">
          <div class="area-name">{{ areaInfo.name2 }}</div>
          <div class="right-score">3</div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import { mapState } from 'vuex'
import Util from '@/assets/js/util'
import Storage from '@/assets/js/storage'
export default {
  created() {},
  mounted() {},
  data() {
    return {
      athleteInfo: {
        name1: '王全瑞',
        name2: '方强国'
      },
      areaInfo: {
        name1: '福建',
        name2: '安徽'
      }
    }
  },
  watch: {},
  computed: {
    ...mapState({})
  },
  filters: {},
  components: {},
  methods: {}
}
</script>
<style scoped lang="less">
@import '@/assets/less/home.less';
</style>
